<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %> 
<c:set var="base" value="${pageContext.request.contextPath}"></c:set>
 
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>设备详情</title>
  <link href="${base}/assets/css/public.css" rel="stylesheet">
  <link href="${base}/assets/css/list.css" rel="stylesheet">
  <script src="${base}/assets/js/jquery.min.js"></script>
  <script type="text/javascript" src="${base}/assets/js/JsBarcode.all.js"></script>  
  <script type="text/javascript" src="${base}/assets/js/jquery.qrcode.min.js"></script>
    <script type="text/javascript" src="${base}/assets/js/jquery.PrintArea.js"></script>
     <script type="text/javascript" src="${base}/assets/js/jquery.jqprint-0.3.js"></script>
    
  <style>
	#pageshow{
		height:40px;
		padding-left: 30%;
	}
	#pageshow a{
		float:left;
		    text-decoration: none;
		font-family: consolas;
	}
	#pagenum{
		float:left;
	}
	
	#printdiv span{
		
	}
	#printdiv img{
		margin: 10px 0;
	}
	.black_overlay{
	display: none;
	position: absolute;
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;
	background-color: black;
	z-index:1001;
	-moz-opacity: 0.8;
	opacity:.80;
	filter: alpha(opacity=80);
	}
</style> 
</head>
<body>
<div class="top">
   <c:import url="../commons/top.jsp"/>
</div>
<div class="wrap">
  <div class="side">
   	<c:import url="../commons/sidebar.jsp"/>
  </div>
  <div class="cont">
    <div class="bread">
      <span>设备管理</span><span>&nbsp;&gt;&nbsp;</span><span>设备详情</span>
      <div class="excel-add">
      		<a class="add" href="javascript:void(0)" onclick="fahui()">返回</a>
      </div>
      <script type="text/javascript">
		function fahui(){				
			var url ="${base}/back/devicelist.do?pageNo=${pageNo}";
			var status='${status}';
			var wid='${wid}';
			var cid='${cid}';
			var fcid='${fcid}';
			var dcid='${dcid}';
			var no='${no}';
			if(status!=null&&status!="") url+="&status="+status;
			if(wid!=null&&wid!="") url+="&wid="+wid;
			if(cid!=null&&cid!="") url+="&cid="+cid;
			if(fcid!=null&&fcid!="") url+="&fcid="+fcid;
			if(dcid!=null&&dcid!="") url+="&dcid="+dcid;
			if(no!=null&&no!="") url+="&no="+no;
			window.location.href = url;
		}
      </script>
      <div class="clear"></div>
    </div>

    <table class="detail-list" width="100%" border="1" cellspacing="0" cellpadding="0" bordercolor="#e7ecf1" style="float:left; margin-bottom:0px;">
      <thead>
         <tr>
              <td width=80% style="font-size:18px;">设备详情</td>
              <td>
              <c:if test="${admin.utype=='1'}">   
                <a style="background-color:#337ab7" onclick="submitbf(${ddv.id})">点击报废 </a>
                <a href="${base}/back/devicemod.do?id=${ddv.id}">修改</a>
              </c:if>
              </td>
         </tr>
      </thead>
    </table>
	<table class="detail-list" width="70%" border="1" cellspacing="0" cellpadding="0" bordercolor="#e7ecf1" style="float:left;border-color:#e7ecf1">
      <tbody>
         <tr style="width: 18px;height:15px;">
              <td>设备类别：${ddv.cdname}</td>
              <td>型号：${ddv.xhno}</td>
              <td>采购价:${ddv.cgjg}(元)</td>
         </tr>
         <tr>
              <td>品牌：${ddv.brand}</td>
              <td>出厂编号：${ddv.ccno}</td>
              <td>当前位置:${ddv.whname}</td>
         </tr>
         <tr>
              <td>旧编号：${ddv.oldno}</td>
              <td>投产年月：${ fn:substring(ddv.tcrq ,0,10)}</td>
              <td><c:if test="${ddv.status =='1'}">状态:正常</c:if>
                  <c:if test="${ddv.status =='2'}">状态:已出库</c:if>
                  <c:if test="${ddv.status =='3'}">状态:已报废</c:if>
              </td>
         </tr>
         <tr>
             <td>原始位置：${ddv.oriwhname}</td>
             <td>编号：${ddv.no}</td>
             <td>折旧年限：${ddv.zjnx}</td>
         </tr>
         <tr>
             <td>备注:<a href="#" title="${ddv.remark}">${ fn:substring(ddv.remark ,0,10)}...</a></td>
             <td></td>
             <td></td>
         </tr>
      </tbody>
    </table>
    <div class="wx-code" style="float:left;width:30%;">
                <div id="printdiv" style="text-align: center;">
                	<span style="text-align: center;">位置：${ddv.whname}</span><br/>
                	<span style="text-align: center;">类别：${ddv.cdname}</span><br/>
                	<img id="image" src="${base}/back/qrcodeimg.do?no=${ddv.no}" /><br/>
                	<span style="text-align: center;">编号：${ddv.no}</span>
                	<%-- <div style="page-break-after: always;"></div> 
                	
                	<span style="text-align: center;">位置：${ddv.whname}</span><br/>
                	<span style="text-align: center;">类别：${ddv.cdname}</span><br/>
                	<img id="image" src="${base}/back/qrcodeimg.do?no=${ddv.no}" /><br/>
                	<span style="text-align: center;">编号：${ddv.no}222</span>
                	<div style="page-break-after: always;"></div> 
                	
                	<span style="text-align: center;">位置：${ddv.whname}</span><br/>
                	<span style="text-align: center;">类别：${ddv.cdname}</span><br/>
                	<img id="image" src="${base}/back/qrcodeimg.do?no=${ddv.no}" /><br/>
                	<span style="text-align: center;">编号：${ddv.no}333</span> --%>
                	<%-- <div style="page-break-after: always;"></div> 
                	
                	<span style="text-align: center;">位置：${ddv.whname}</span><br/>
                	<span style="text-align: center;">类别：${ddv.cdname}</span><br/>
                	<img id="image" src="${base}/back/qrcodeimg.do?no=${ddv.no}" /><br/>
                	<span style="text-align: center;">编号：${ddv.no}</span> --%>
                </div>
                <%-- <p>${ddv.no}</p> --%>
              <%--   <c:if test="${admin.utype=='1'}"> --%>
                	<a style="color:blue;text-decoration:underline;margin-top:30px;width: 80px;height: 40px;background-color: #337ab7;color: #fff;text-align: center;line-height: 40px;cursor: pointer;" onclick="printqr();">打印设备码</a>
                 <%-- </c:if> --%>
                
    </div>
    <script type="text/javascript">
	               function printqr(id){
                    $("#printdiv").printArea();
                   }
              </script>
    <div class="clear"></div>
    <table id="sample_editable_1" class="detail-list" width="100%" border="1" cellspacing="0" cellpadding="0" bordercolor="#e7ecf1" style="border-color:#e7ecf1">
      <thead>
         <tr>
              <td colspan="5" style="font-size:18px;">出入库记录</td>
         </tr>
      </thead>
      <tbody>
         <tr class="tle">
              <td>操作时间</td>
              <td>操作类型</td>
              <td>原位置</td>
              <td>所在位置</td>
              <td>操作用户</td>
         </tr>
         <c:forEach items="${ioslist}" var="ios">
           <tr>
              <td>${ fn:substring(ios.cotime ,0,10)}</td>
              <td><c:if test="${ios.corm == '1'}">新增</c:if>
                  <c:if test="${ios.corm == '2'}">入库</c:if>
                  <c:if test="${ios.corm == '3'}">出库</c:if>
                  <c:if test="${ios.corm == '4'}">报废</c:if>
                  <c:if test="${ios.corm == '5'}">修改</c:if>
              </td>
              <td>
                  <c:if test="${empty ios.orwhname}">无</c:if>
                  <c:if test="${not empty ios.orwhname}">${ios.orwhname}</c:if>
             </td>
             <td>${ios.whname}</td>
             <td>${ios.couser}</td>
           </tr>
        </c:forEach>
      </tbody>
    </table>
	    <div id="pageshow">
			<a id="btn0"  style="font-size: 16px;margin-right:15px;"></a>
			<a href="#" id="btn1"  title="首页" style="font-size: 18px;margin-right:15px;"> << </a>
			<a href="#" id="btn2"  title="上一页" style="font-size: 18px;margin-right:15px;"> < </a>
			<div id="pagenum" ></div>
			<a href="#" id="btn3"  title="下一页" style="font-size: 18px;margin-right:15px;"> > </a>
			<a href="#" id="btn4"  title="末页" style="font-size: 18px;margin-right:15px;"> >> </a>
			<a id="sjzl"  style="font-size: 16px;"></a>
		</div>
  </div>
  <div class="clear"></div>
</div>
</body>
</html>
<script type="text/javascript">
	function submitbf(id){
		var mymessage=window.confirm('是否确认报废此设备？');  
	    if(mymessage==true){  
	    	var url = '${base}/back/submitbf.do?id='+id;
	    	window.location.href = url;
	    }else if(mymessage==false){  
	    	 return; 
	    }
		
	};
	
	var pageSize = 10;    //每页显示的记录条数
	var curPage=0;        //当前页
	var lastPage;        //最后页
	var direct=0;        //方向
	var len;            //总行数
	var page;            //总页数
	var begin;
	var end;
	var pagetag = new Array();
	display();
	
  function display(){
		
	    len =$("#sample_editable_1 tr").length - 1;    // 求这个表的总行数，剔除第一行介绍
	    page= (len % pageSize==0) ? (len/ pageSize): (Math.floor(len/pageSize)+1);//根据记录条数，计算页数
	    //alert("page==="+page);
	    curPage=1;    // 设置当前为第一页
	    
	    for (var i = 1; i <= page; i++) {
			$("#pagenum").append('<button id="dqjm_'+i+'" style="font-size: 14px">' + i + '</button>&nbsp;');
			$("#dqjm_" + i).hide();
		}
		$("#dqjm_" + curPage).css({'background-color':'#0086ff'});

		for (var i = curPage; i <= page; i++) {
			if(i<curPage + pageSize){
				$("#dqjm_" + i).show();
				pagetag.push(i);
			}
		}
		if(pagetag.length<pageSize){
			var nednum = pageSize - pagetag.length;
			for (var k=1; k <= nednum;k++) {
					$("#dqjm_" + (curPage-k)).show();
					pagetag.splice(0,0,(curPage-k));	
			}
		}
		
	    displayPage(1);//显示第一页
	
	    $("#btn0").html("第 " + curPage + "页" +"   共"+ page + "页 ");    // 显示当前多少页
	    $("#sjzl").html("共计" + len + "条");        // 显示数据量
	   /*  document.getElementById("pageSize").value = pageSize; */   
 }
  
  $("#btn1").click(function firstPage(){    // 首页
      curPage=1;
      direct = 0;
      $("#pageNo").val(curPage.toString());
      displayPage();
  });
  $("#btn2").click(function frontPage(){    // 上一页
      direct=-1;
      displayPage();
      var tt = pagetag[0];
		if( tt != 1){
			$("#dqjm_" + (tt - 1)).show();
			pagetag.pop();
			pagetag.splice(0,0,tt - 1);
		}
		$("#pagenum > button").each(function (i){
      	var sidx = parseInt(this.innerHTML);
      	if(curPage != sidx) $(this).css({'background-color':''});
      });
      $("#dqjm_" + curPage).css({'background-color':'#0086ff'});
		for (var j = curPage; j <= page; j++) {
			if(jQuery.inArray( j,pagetag)>=0){
				$("#dqjm_" + j).show();
			}else{
				$("#dqjm_" + j).hide();
			}
			
		}
  });
  $("#btn3").click(function nextPage(){    // 下一页
  	
      direct=1;
      displayPage();
      if(pagetag[pagetag.length -1] != page){
			$("#dqjm_" + pagetag[0]).hide();
			pagetag.shift();
			pagetag.push(pagetag[pagetag.length -1]+1);
		}
      $("#pagenum > button").each(function (i){
      	var sidx = parseInt(this.innerHTML);
      	if(curPage != sidx) $(this).css({'background-color':''});
      });
      $("#dqjm_" + curPage).css({'background-color':'#0086ff'});
		for (var j = curPage; j <= page; j++) {
			if(jQuery.inArray( j,pagetag)>=0){
				$("#dqjm_" + j).show();
			}else{
				$("#dqjm_" + j).hide();
			}
			
		}
  });
  $("#btn4").click(function lastPage(){    // 尾页
      curPage=page;
      direct = 0;
      $("#pageNo").val(curPage.toString());
      displayPage();
  }); 
  $("#pagenum > button").click(function firstPage(){    // 首页

  	var idx = parseInt(this.innerHTML); 
      curPage=idx;
      $(this).css({'background-color':'#0086ff'});
      $("#pagenum > button").each(function (i){
      	var sidx = parseInt(this.innerHTML);
      	if(idx != sidx) $(this).css({'background-color':''});
      });
      //direct = 0;
      $("#pageNo").val(curPage.toString());
      
      document.getElementById("btn0").innerHTML="第 " + curPage + "页" +"   共"+ page + "页 ";        // 显示当前多少页
  	
	    begin=(curPage-1)*pageSize + 1;// 起始记录号
	    end = begin + 1*pageSize - 1;    // 末尾记录号
	
	    if(end > len ) end=len;
	    $("#sample_editable_1 tr").hide();    // 首先，设置这行为隐藏
	    $("#sample_editable_1 tr").each(function(i){    // 然后，通过条件判断决定本行是否恢复显示
	        if((i>=begin && i<=end) || i==0 )//显示begin<=x<=end的记录
	            $(this).show();
	    });
  });
	function displayPage(){
	    if(curPage <=1 && direct==-1){
	        direct=0;
	        alert("已经是第一页了");
	        return;
	    } else if (curPage >= page && direct==1) {
	        direct=0;
	        alert("已经是最后一页了");
	        return ;
	    }
	
	    lastPage = curPage;
	
	    // 修复当len=1时，curPage计算得0的bug
	    if (len > pageSize) {
	        curPage = ((curPage + direct + len) % len);
	        $("#pageNo").val(curPage.toString());
	    } else {
	        curPage = 1;
	        $("#pageNo").val(curPage.toString());
	    }
	    document.getElementById("btn0").innerHTML="第 " + curPage + "页" +"   共"+ page + "页 ";        // 显示当前多少页
	
	    begin=(curPage-1)*pageSize + 1;// 起始记录号
	    end = begin + 1*pageSize - 1;    // 末尾记录号
	
	    if(end > len ) end=len;
	    $("#sample_editable_1 tr").hide();    // 首先，设置这行为隐藏
	    $("#sample_editable_1 tr").each(function(i){    // 然后，通过条件判断决定本行是否恢复显示
	        if((i>=begin && i<=end) || i==0 )//显示begin<=x<=end的记录
	            $(this).show();
	    });
	
	}

</script>